<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ page isELIgnored="false"%>
<%@ page import="java.util.List"%>
<%@ page import="com.oocl.ha.entity.Dish"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<html>
<head>
<meta charset="UTF-8">
<title>商家</title>

<link rel="stylesheet" type="text/css" href="../css/normalize.css" />
<link rel="stylesheet" type="text/css" href="../css/demo.css" />
<link rel="stylesheet" type="text/css" href="../css/icons.css" />
<link rel="stylesheet" type="text/css" href="../css/component.css" />
<link rel="stylesheet" type="text/css" href="../css/head.css" />
<script src="../js/modernizr.custom.js"></script>
<script language="JavaScript"
	src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
<script language="JavaScript" src="../js/bootstrap.js"></script>
<link rel="stylesheet" type="text/css" href="../css/bootstrap.css" />
<link href="../css/merchant.css" rel="stylesheet" type="text/css" />
<style type="text/css">
.dish_img {
	width: 100px;
	height: 100px;
}

.unde {
	background: #DDDDDD;
}
</style>
</head>
<body>
	<ul id="nav" class="hul">
		<img src="http://10.222.232.168:83/img/logo.png" />
		<li class="logout"><a href="logOut">注销</a></li>
		<li class="logout"><a href="orderManager.jsp" id="newMsg"></p></a></li>
	</ul>

	<div id="st-container" class="st-container">
		<nav class="st-menu st-effect-1" id="menu-1">
			<h2 class="icon icon-lab">商家</h2>
			<ul>
				<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
				<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
				<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
				<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
			</ul>
		</nav>

		<nav class="st-menu st-effect-2" id="menu-2">
			<h2 class="icon icon-lab">商家</h2>
			<ul>
				<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
				<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
				<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
				<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
			</ul>
		</nav>

		<nav class="st-menu st-effect-4" id="menu-4">
			<h2 class="icon icon-lab">商家</h2>
			<ul>
				<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
				<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
				<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
				<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
			</ul>
		</nav>

		<nav class="st-menu st-effect-5" id="menu-5">
			<h2 class="icon icon-lab">商家</h2>
			<ul>
				<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
				<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
				<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
				<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
			</ul>
		</nav>

		<nav class="st-menu st-effect-9" id="menu-9">
			<h2 class="icon icon-lab">商家</h2>
			<ul>
				<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
				<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
				<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
				<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
			</ul>
		</nav>

		<nav class="st-menu st-effect-10" id="menu-10">
			<h2 class="icon icon-lab">商家</h2>
			<ul>
				<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
				<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
				<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
				<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
			</ul>
		</nav>

		<nav class="st-menu st-effect-11" id="menu-11">
			<h2 class="icon icon-lab">商家</h2>
			<ul>
				<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
				<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
				<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
				<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
			</ul>
		</nav>

		<nav class="st-menu st-effect-12" id="menu-12">
			<h2 class="icon icon-lab">商家</h2>
			<ul>
				<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
				<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
				<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
				<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
			</ul>
		</nav>

		<nav class="st-menu st-effect-13" id="menu-13">
			<h2 class="icon icon-lab">商家</h2>
			<ul>
				<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
				<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
				<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
				<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
			</ul>
		</nav>


		<div class="st-pusher">
			<nav class="st-menu st-effect-3" id="menu-3">
				<h2 class="icon icon-lab">商家</h2>
				<ul>
					<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
					<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
					<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
					<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
				</ul>
			</nav>

			<nav class="st-menu st-effect-6" id="menu-6">
				<h2 class="icon icon-lab">商家</h2>
				<ul>
					<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
					<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
					<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
					<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
				</ul>
			</nav>

			<nav class="st-menu st-effect-7" id="menu-7">
				<h2 class="icon icon-lab">商家</h2>
				<ul>
					<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
					<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
					<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
					<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
				</ul>
			</nav>

			<nav class="st-menu st-effect-8" id="menu-8">
				<h2 class="icon icon-lab">商家</h2>
				<ul>
					<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
					<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
					<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
					<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
				</ul>
			</nav>

			<nav class="st-menu st-effect-14" id="menu-14">
				<h2 class="icon icon-lab">商家</h2>
				<ul>
					<li><a class="icon icon-data" href="dishManager.jsp">菜单管理</a></li>
					<li><a class="icon icon-study" href="orderManager.jsp">订单管理</a></li>
					<li><a class="icon icon-wallet" href="historyOrder.jsp">历史订单</a></li>
					<li><a class="icon icon-phone" href="merchentMsg.jsp">商家信息</a></li>
				</ul>
			</nav>
			<div class="st-content">
				<div class="st-content-inner">

					<div class="main clearfix">
						<div id="st-trigger-effects" class="column">

							<button data-effect="st-effect-8">商家管理</button>

						</div>
						<div class="dish">

							<div class="addDish">
								<a href="addDish.jsp"><button type="button"
										class="btn btn-default btn-lg">添加菜品</button></a>
							</div>

							<div id=dishDiv class="table-si">

								<table id="dishTable" class="table">
									<tr>
										<th>图片</th>
										<th>菜品</th>
										<th>价格</th>
										<th>删除</th>
										<th>下架</th>
										<th>推荐</th>
									</tr>

								</table>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script src="../js/classie.js"></script>
	<script src="../js/sidebarEffects.js"></script>

</body>
<script>
	$(document).ready(function() {
		loadAllDish();
	});

	function loadAllDish() {
		$.ajax("loadAllDish", {
			method : "GET",
			type : "json",
			success : function(result) {
				if (result) {
					parseDish(result.dList);
				}
			}
		});
	}

	function parseDish(data) {
		var tb = document.getElementById("dishTable");
		data.forEach(function(item, index, array) {
			var tr = document.createElement("tr");
			tr.setAttribute("id", item.did);
			var but1 = document.createElement("button");
			var but2 = document.createElement("button");
			var but3 = document.createElement("button");
			but1.innerHTML = "删除";
			but2.innerHTML = "下架";
			but3.innerHTML = "推荐";
			if (item.price < 0) {
				but2.setAttribute("disabled", "disabled");
				but3.setAttribute("disabled", "disabled");
			}
			if (item.price < 0) {
				tr.setAttribute("class", "unde");
			}
			var td1 = document.createElement("td");
			var td2 = document.createElement("td");
			var td3 = document.createElement("td");
			var td4 = document.createElement("td");
			var td5 = document.createElement("td");
			var td6 = document.createElement("td");

			var img = document.createElement("img");
			img.setAttribute("class", "dish_img");
			img.setAttribute("src", item.dicon);
			img.setAttribute("width", "30");
			img.setAttribute("height", "30");
			td1.appendChild(img);
			td2.innerHTML = item.dname;
			if (item.price < 0) {
				item.price *= (-1);
			}
			td3.innerHTML = item.price;

			but1.onclick = function() {
				deleteDish(item.did);
			}
			but1.setAttribute("class", "btn btn-default");
			but2.onclick = function() {
				undercarriageDish(item.did);
			}
			but2.setAttribute("class", "btn btn-default");
			but3.onclick = function() {
				recommendDish(item.did);
			}
			but3.setAttribute("class", "btn btn-default");
			td4.appendChild(but1);
			td5.appendChild(but2);
			td6.appendChild(but3);
			tr.appendChild(td1);
			tr.appendChild(td2);
			tr.appendChild(td3);
			tr.appendChild(td4);
			tr.appendChild(td5);
			tr.appendChild(td6);
			tb.appendChild(tr);
		});
	}
	function deleteDish(did) {
		var tb = document.getElementById("dishTable");
		var tr = document.getElementById(did);
		tb.removeChild(tr);
		var data = {
			"dId" : did
		};
		$.ajax("deleteDish", {
			method : "GET",
			type : "json",
			data : data,
			success : function(result) {
				console.log(result);
			}
		});
	}
	function undercarriageDish(did) {
		var data = {
			"dId" : did
		};
		$.ajax("undercarriage", {
			method : "GET",
			type : "json",
			data : data,
			success : function(result) {
				if (result != null) {
					var tr = document.getElementById(did);
					tr.setAttribute("class", "unde");
				}
			}
		});

	}
	function recommendDish(did) {
		var data = {
			"dId" : did
		};
		$.ajax("recommendDish", {
			method : "GET",
			type : "json",
			data : data,
			success : function(result) {
				console.log(result);
			}
		});
	}
</script>

</html>